<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="zh-CN">

<head>
  <meta charset="UTF-8">
  <title>首页</title>
  <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
  <meta name="keywords" content="" />
  <meta name="description" content="" />
  <meta name="apple-mobile-web-app-capable" content="no" />
  <meta name="format-detection" content="telephone=no">
  <link rel="stylesheet" href="${pageContext.request.contextPath}/static/css/base.css">
  <link rel="stylesheet" href="${pageContext.request.contextPath}/static/css/index.css">
   <script>
     
  (function( window , document ){
	var hotcss = {},
    maxWidth = 640,
    designWidth = 0;
	hotcss.mresize = function(){
		var innerWidth = document.documentElement.getBoundingClientRect().width || window.innerWidth;
		if( !innerWidth ){ return false;}
    if(innerWidth>maxWidth){
      innerWidth = maxWidth;
    }
    var eles = document.querySelectorAll('.floor_container');
    [].forEach.call(eles,function(ele){
      	ele.style.height = ( innerWidth*20/320 )*7.89333334 + 'px';
    });
	};

	window.addEventListener('DOMContentLoaded', hotcss.mresize , false ); 

	window.addEventListener( 'resize' , function(){
		clearTimeout( hotcss.tid );
		hotcss.tid = setTimeout( hotcss.mresize , 33 );
	} , false ); 
	window.addEventListener('load',function(){
     hotcss.mresize();
     setTimeout( hotcss.mresize , 333);
  } , false );
})( window , document );
  </script>
</head>

<body class="ovh">
<%@ include file="/WEB-INF/jsp/public.jsp"%>	
  <div class="search dt f0">
      <span class="search_bg"></span>
      <div class="search__box rel">
        <i class="icon__search abs"></i>
        <input class="search__input" id="search" name="search" type="text" placeholder="请在搜索框内输入你所要查询的内容">
      </div>
      <a class="search__btn" >搜索</a>
  </div>	
<div class="content">	
  <div class="head rel">
    <div class="banner rel ovh">
      <div class="swiper-container">
        <div class="swiper-wrapper" id="recommended_head"></div>
      </div>
      <div class="nav_bg"><img src="${pageContext.request.contextPath}/static/images/bg_bl_01.png" width="100%"></div>
    </div>
    <script>
       (function( window , document ){
          var hotcss = {},
            maxWidth = 640,
            designWidth = 0;
          hotcss.mresize = function(){
            var innerWidth = document.documentElement.getBoundingClientRect().width || window.innerWidth;
            if( !innerWidth ){ return false;}
            if(innerWidth>maxWidth){
              innerWidth = maxWidth;
            }

            var ele = document.querySelector('.banner')
              ele.style.height = Math.round(( innerWidth*20/375 )*8)+ 'px';
          }
          hotcss.mresize()
          window.addEventListener('DOMContentLoaded', hotcss.mresize , false ); 

          window.addEventListener( 'resize' , function(){
            clearTimeout( hotcss.tid );
            hotcss.tid = setTimeout( hotcss.mresize , 33 );
          } , false ); 
          window.addEventListener('load',function(){
            hotcss.mresize();
            setTimeout( hotcss.mresize , 333);
          } , false );
        })( window , document );
      </script>
    <div class="nav">
      <ul>
        <li class="nav__item">
          <a href="javascript:;" id="btn_sort">
            <span class="nav__icon nav__icon_one"></span>
            <p class="nav__txt">分类</p>
          </a>
        </li>
        <li class="nav__item">
          <a href="javascript:notOpen()">
            <span class="nav__icon nav__icon_two"></span>
            <p class="nav__txt">活动</p>
          </a>
        </li>
        <li class="nav__item">
          <a href="${pageContext.request.contextPath}/vip">
            <span class="nav__icon nav__icon_three"><i class="tips__icon_01"></i></span>
            <p class="nav__txt">兑换券商城</p>
          </a>
        </li>
        <li class="nav__item">
          <a href="${pageContext.request.contextPath}/api#/user">
            <span class="nav__icon nav__icon_four"></span>
            <p class="nav__txt">个人中心</p>
          </a>
        </li>
      </ul>
    </div>
  </div>
  <!-- 推荐 -->
  <div class="floor">
    <div class="floor_title tc">
      <span class="title__bg_01 dib"></span>
    </div>
    <div class="floor__scroll">
      <div class="scroll">
        <div class="swiper-wrapper" id="recommended_middle">
          
        </div>
      </div>
    </div>
  </div>
   <!-- 分类 -->
  <div class="floor sort_subclass">
    <h1 class="sort_name">F1</h1>
    <div class="floor_container fix">
      <div class="lf l">
        <a href="${pageContext.request.contextPath}/goods?parentid=3&classifyname=中外名车"><img src="static/images/sort/f1/1.png" alt=""></a>
      </div>
      <div class="rt l">
        <div class="rt_top">
          <a href="${pageContext.request.contextPath}/goods?parentid=3&classifyname=中外名车"><img src="static/images/sort/f1/2.png" alt=""></a>
        </div>
        <div class="rt_bot_lt l">
          <a href="${pageContext.request.contextPath}/goods?parentid=3&classifyname=中外名车"><img src="static/images/sort/f1/3.png" alt=""></a>
        </div>
        <div class="rt_bot_rt r">
          <a href="${pageContext.request.contextPath}/goods?parentid=3&classifyname=中外名车"><img src="static/images/sort/f1/4.png" alt=""></a>
        </div>
      </div>
    </div>
  </div>
  <div class="floor sort_subclass">
    <h1 class="sort_name">F2</h1>
    <div class="floor_container fix">
      <div class="lf l">
        <a href="${pageContext.request.contextPath}/goods?parentid=72&classifyname=中外美酒"><img src="static/images/sort/f2/1.png" alt=""></a>
      </div>
      <div class="rt l">
        <div class="rt_bot_lt l">
          <a href="${pageContext.request.contextPath}/goods?parentid=72&classid=219&classifyname=进口美酒"><img src="static/images/sort/f2/2.png" alt=""></a>
        </div>
        <div class="rt_bot_rt r">
          <div class="">
            <a href="${pageContext.request.contextPath}/goods?parentid=72&classifyname=中外美酒"><img src="static/images/sort/f2/3.png" alt=""></a>
          </div>
          <div class="">
            <a href="${pageContext.request.contextPath}/goods?parentid=72&classid=73&classifyname=白酒"><img src="static/images/sort/f2/4.png" alt=""></a>
          </div>
        </div>
      </div>
    </div>
  </div>
  <div class="floor sort_subclass">
    <h1 class="sort_name">F3</h1>
    <div class="floor_container fix">
      <div class="lf l">
        <a href="${pageContext.request.contextPath}/goods?parentid=559&classifyname=家用电器"><img src="static/images/sort/f3/1.png" alt=""></a>
      </div>
      <div class="rt l">
        <div class="rt_top">
          <a href="${pageContext.request.contextPath}/goods?parentid=559&classid=662&classifyname=个护电器"><img src="static/images/sort/f3/2.png" alt=""></a>
        </div>
        <div class="rt_bot_lt l">
           <a href="${pageContext.request.contextPath}/goods?parentid=559&classifyname=家用电器"><img src="static/images/sort/f3/3.png" alt=""></a>
        </div>
        <div class="rt_bot_rt r">
           <a href="${pageContext.request.contextPath}/goods?parentid=559&classifyname=家用电器"><img src="static/images/sort/f3/4.png" alt=""></a>
        </div>
      </div>
    </div>
  </div>
  <div class="floor sort_subclass">
    <h1 class="sort_name">F4</h1>
    <div class="floor_container fix">
      <div class="lf l">
        <a href="${pageContext.request.contextPath}/goods?parentid=84&classifyname=个护百货"><img src="static/images/sort/f4/1.png" alt=""></a>
      </div>
      <div class="rt l">
        <div class="rt_bot_lt l">
          <a href="${pageContext.request.contextPath}/goods?parentid=84&classid=85&classifyname=面部护理"><img src="static/images/sort/f4/2.png" alt=""></a>
        </div>
        <div class="rt_bot_rt r">
          <div class="">
            <a href="${pageContext.request.contextPath}/goods?parentid=84&classid=642&classifyname=毛巾浴巾"><img src="static/images/sort/f4/3.png" alt=""></a>
          </div>
          <div class="">
            <a href="${pageContext.request.contextPath}/goods?parentid=84&classifyname=个护百货"><img src="static/images/sort/f4/4.png" alt=""></a>
          </div>
        </div>
      </div>
    </div>
  </div>
  <div class="floor sort_subclass">
    <h1 class="sort_name">F5</h1>
    <div class="floor_container fix">
      <div class="lf l">
        <a href="${pageContext.request.contextPath}/goods?parentid=74&classifyname=珠宝配饰"><img src="static/images/sort/f5/1.png" alt=""></a>
      </div>
      <div class="rt l">
        <div class="rt_top">
          <a href="${pageContext.request.contextPath}/goods?parentid=74&classifyname=珠宝配饰"><img src="static/images/sort/f5/2.png" alt=""></a>
        </div>
        <div class="rt_bot_lt l">
          <a href="${pageContext.request.contextPath}/goods?parentid=74&classifyname=珠宝配饰"><img src="static/images/sort/f5/3.png" alt=""></a>
        </div>
        <div class="rt_bot_rt r">
          <a href="${pageContext.request.contextPath}/goods?parentid=74&classifyname=珠宝配饰"><img src="static/images/sort/f5/4.png" alt=""></a>
        </div>
      </div>
    </div>
  </div>
  <div class="floor sort_subclass">
    <h1 class="sort_name">F6</h1>
    <div class="floor_container fix">
      <div class="lf l">
        <a href="${pageContext.request.contextPath}/goods?parentid=1&classifyname=手机数码"><img src="static/images/sort/f6/1.png" alt=""></a>
      </div>
      <div class="rt l">
        <div class="rt_bot_lt l">
          <a href="${pageContext.request.contextPath}/goods?parentid=1&classid=225&classifyname=电脑"><img src="static/images/sort/f6/2.png" alt=""></a>
        </div>
        <div class="rt_bot_rt r">
          <div class="">
            <a href="${pageContext.request.contextPath}/goods?parentid=1&classid=220&classifyname=手机"><img src="static/images/sort/f6/3.png" alt=""></a>
          </div>
          <div class="">
            <a href="${pageContext.request.contextPath}/goods?parentid=1&classid=224&classifyname=配件"><img src="static/images/sort/f6/4.png" alt=""></a>
          </div>
        </div>
      </div>
    </div>
  </div>
  <div class="floor sort_subclass">
    <h1 class="sort_name">F7</h1>
    <div class="floor_container fix">
      <div class="lf l">
        <a href="${pageContext.request.contextPath}/goods?parentid=565&classifyname=家具家纺"><img src="static/images/sort/f7/1.png" alt=""></a>
      </div>
      <div class="rt l">
        <div class="rt_top">
          <a href="${pageContext.request.contextPath}/goods?parentid=565&classifyname=家具家纺"><img src="static/images/sort/f7/2.png" alt=""></a>
        </div>
        <div class="rt_bot_lt l">
          <a href="${pageContext.request.contextPath}/goods?parentid=565&classid=567&classifyname=厨具"><img src="static/images/sort/f7/3.png" alt=""></a>
        </div>
        <div class="rt_bot_rt r">
          <a href="${pageContext.request.contextPath}/goods?parentid=565&classid=566&classifyname=家纺"><img src="static/images/sort/f7/4.png" alt=""></a>
        </div>
      </div>
    </div>
  </div>
  <div class="floor sort_subclass">
    <h1 class="sort_name">F8</h1>
    <div class="floor_container fix">
      <div class="lf l">
        <a href="${pageContext.request.contextPath}/goods?parentid=190&classifyname=服装皮包"><img src="static/images/sort/f8/1.png" alt=""></a>
      </div>
      <div class="rt l">
        <div class="rt_bot_lt l">
          <a href="${pageContext.request.contextPath}/goods?parentid=190&classifyname=服装皮包"><img src="static/images/sort/f8/2.png" alt=""></a>
        </div>
        <div class="rt_bot_rt r">
          <div class="">
            <a href="${pageContext.request.contextPath}/goods?parentid=190&classifyname=服装皮包"><img src="static/images/sort/f8/3.png" alt=""></a>
          </div>
          <div class="">
            <a href="${pageContext.request.contextPath}/goods?parentid=190&classid=648&classifyname=内衣"><img src="static/images/sort/f8/4.png" alt=""></a>
          </div>
        </div>
      </div>
    </div>
  </div>
  
  <!-- 热门 -->
  <div class="floor">
    <div class="floor_title tc rel" id="hot">
      <a class="btn__more abs" href="${pageContext.request.contextPath}/goods">更多>></a>
      <span class="title__bg_02 dib"></span>
    </div>
    <div class="floor__popular">
      <ul id="hotGoods">
      
      	<li class="popular__item placeholder" id="foo"></li>
      	<li class="popular__item placeholder"></li>
      </ul>
      <div class="lodingStyle dn"><div class="spinner"><div class="rect1"></div><div class="rect2"></div><div class="rect3"></div><div class="rect4"></div><div class="rect5"></div></div><span class="txt">正在加载</span></div>   
    </div>
  </div>
  </div>
  <script src="${pageContext.request.contextPath}/static/js/lib/bundle.js"></script>
  <script src="${pageContext.request.contextPath}/static/js/lib/jquery/jquery.min.js"></script>
  <script src="${pageContext.request.contextPath}/static/js/lib/swiper.min.js"></script>
  <script src="${pageContext.request.contextPath}/static/js/wap/main-index.js"></script>
  <script src="${pageContext.request.contextPath}/static/js/lib/index.js"></script>
  <script src="${pageContext.request.contextPath}/static/js/lib/layer/layer.js"></script>
  <script type="text/javascript" src="${pageContext.request.contextPath}/static/js/lib/dropload.js"></script>
  <script src="${pageContext.request.contextPath}/static/js/lib/menu.js"></script>
</body>
</html>